<!--
 * @Author: xuzehan 123@qq.com
 * @Date: 2023-04-11 14:14:52
 * @LastEditors: xuzehan 935351619@qq.com
 * @LastEditTime: 2024-05-28 10:35:19
 * @FilePath: \ant-design-vue-jeecg-master\src\views\taskManagement\taskMonitoring.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <!-- <a-col :md="6" :sm="12">
            <a-form-item label="任务名称">
             <j-input placeholder="输入任务名称模糊查询" v-model="queryParam.processDefineId_dictText"></j-input>
            </a-form-item>
          </a-col> -->

          <a-col :md="6" :sm="10">

            <a-form-item label="任务开始时间">
              <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择任务开始时间"
                v-model="queryParam.createTime"></j-date>
            </a-form-item>
            <!-- <a-form-item label="开始时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-date-picker
                style="width: 210px"
                valueFormat="YYYY-MM-DD"
                format="YYYY-MM-DD"
                :showTime="{ defaultValue: moment() }"
                v-model="queryParam.createTimes"
                @change="onDateChange"
                @ok="onDateOk"
              />
            </a-form-item> -->
          </a-col>

          <a-col :md="6" :sm="8">
            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button
                type="primary"
                @click="searchReset"
                icon="reload"
                style="margin-left: 8px"
              >重置</a-button>
              <!-- <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
              </a>-->
            </span>
          </a-col>
          <!-- <a-col :md="4" :sm="6">
            <span style class="table-page-search-submitButtons">
              <a-select v-model="queryCar" placeholder="查看完整流程">
                <a-select-option value="1">指控车1</a-select-option>
                <a-select-option value="2">指控车2</a-select-option>
              </a-select>
              <a-button type="primary" @click="handleShow(queryCar)" style="margin-left: 8px">查看</a-button>
            </span>
          </a-col> -->
        </a-row>
      </a-form>
    </div>
    <a-table
      ref="table"
      size="middle"
      bordered
      rowKey="id"
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      :loading="loading"
      class="j-table-force-nowrap"
      @change="handleTableChange"
    >
      <!-- <a slot="name" slot-scope="text">{{ text }}</a>
      <template slot="processStatus" slot-scope="text">
        <span style="cursor: pointer" @click="handleShow(text)">{{ formatStatus(text) }}</span>
      </template>
      <template slot="isExit" slot-scope="text">
        <a-button type="primary" v-if="text == 0">退网</a-button>
        <a-button v-if="text == 1">退网</a-button>
      </template>-->
      <!-- <template slot="processState_dictText" slot-scope="text, record">
        <span :class="text == 1 ? 'warming' : text == 2 ? 'success' : 'err'">
          {{
          text == 1 ? '执行中' : text == 2 ? '成功' : '失败'
          }}
        </span>
      </template> -->
      <span slot="action" slot-scope="text, record">
        <!-- <span @click="handleShow(record.processStatus)">查看详情</span> -->
        <a-button @click="handleShowInfo(record)">查看详情</a-button>
      </span>
    </a-table>
    <!-- <a-button @click="handleShow(0)"> 流程详情</a-button> -->
    <!-- <a-button @click="handleShow(1)"> 开1</a-button> -->
    <flow ref="flow" />
    <detailed-process ref="detailedProcess" />
    <!-- 资源池 -->
    <!-- <pool ref="pool" :data="JSON.stringify(datas)" :small="0" /> -->
    <!-- <pool ref="pool" :total="1920" :small="1" /> -->
  </div>
</template>

<script>
import moment from 'moment'
import flow from './modules/flow.vue'
import detailedProcess from './modules/detailedProcess'
//  <!-- 资源池 -->
import pool from './modules/resourcePool.vue'

import { JeecgListMixin } from '@/mixins/JeecgListMixin'
export default {
  mixins: [JeecgListMixin],
  components: {
    flow,
    pool,
    detailedProcess,
  },
  data() {
    const data = [
      {
        key: '1',
        No: 1,
        name: '导弹信道授权信息',
        processStatus: 3,
        createTime: '2023-02-06 13:52:46',
        endTime: '2023-05-05 12:32:28',
        isExit: 1,
        keyword: '指控车1',
        processName: '封装复合链路帧',
        describe: '通信管控根据导弹需求为导弹分配信道资源后，向指控车反馈信道给导弹分配的信道总数及编号',
        schedule: '20%',
        status: 0,
      },
      {
        key: '2',
        No: 1,
        name: '抗干扰决策（上行）',
        processStatus: '8-1',
        createTime: '2023-02-06 13:52:46',
        endTime: '2023-05-01 16:32:28',
        isExit: 0,
        keyword: '指控车2',
        processName: '获知频谱感知信息',
        describe: '通信管控根据卫星频谱感知结果及星弹上行链路信噪比估计值进行抗干扰决策分析',
        schedule: '45%',
        status: 1,
      },
      {
        key: '3',
        No: 2,
        name: '指控车控星指令鉴权',
        processStatus: '7',
        createTime: '2023-02-06 13:52:46',
        endTime: '/',
        isExit: 1,
        keyword: '指控车3',
        processName: '处理控星指令鉴权申请',
        describe: '通信管控处理指控车控星指令鉴权申请，并判断其是否合法，合法则发送给卫星；不合法则丢弃',
        schedule: '60%',
        status: 1,
      },
      {
        key: '4',
        No: 2,
        name: '导弹网络状态查询',
        processStatus: '10',
        createTime: '2023-02-06 13:52:46',
        endTime: '2023-05-01 16:32:28',
        isExit: 0,
        keyword: '指控车4',
        processName: '点击网络状态查询',
        describe: '通信管控查询该指控车所管控的导弹用户的网络状态',
        schedule: '100%',
        status: 2,
      },
    ]
    return {
      data,
      queryCar: undefined,
      queryParam: {createTimes:undefined},
      isorter: {
        // column: 'id',
        order: 'desc',
      },
      url: {
        // list: '/monitor/nmcTaskMonitor/list',
        list:'/flow/nmcFlowInst/list',
        delete: '/monitor/nmcTaskMonitor/delete',
        deleteBatch: '/monitor/nmcTaskMonitor/deleteBatch',
        exportXlsUrl: '/monitor/nmcTaskMonitor/exportXls',
        importExcelUrl: 'monitor/nmcTaskMonitor/importExcel',
      },
      columns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 80,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        // {
        //   title: '任务编码',
        //   dataIndex: 'id',
        //   key: 'id',
        //   width: 140,
        //   ellipsis: true,
        //   // scopedSlots: { customRender: 'id' },
        // },
        // {
        //   title: '关键词',
        //   dataIndex: 'keyWords',
        //   key: 'keyWords',
        //   // scopedSlots: { customRender: 'name' },
        // },
        // {
        //   title: '任务发起端',
        //   dataIndex: 'initiate',
        //   key: 'initiate',
        //   // scopedSlots: { customRender: 'name' },
        // },
        // {
        //   title: '任务接收端',
        //   dataIndex: 'receive',
        //   key: 'receive',
        //   // scopedSlots: { customRender: 'name' },
        // },
        {
          title: '任务名称',
          dataIndex: 'processDefineId_dictText',
          key: 'processDefineId_dictText',
          ellipsis: true,
          // scopedSlots: { customRender: 'processDefineId_dictText' },
        },
        // {
        //   title: '流程名称',
        //   dataIndex: 'processName',
        //   key: 'processName',
        //   ellipsis: true,
        //   // scopedSlots: { customRender: 'name' },
        // },
        // {
        //   title: '任务描述',
        //   dataIndex: 'taskDesc',
        //   key: 'taskDesc',
        //   width: 220,
        //   ellipsis: true,
        //   // scopedSlots: { customRender: 'name' },
        // },
        // {
        // title: '流程状态',
        // dataIndex: 'processStatus',
        // key: 'processStatus',
        // scopedSlots: { customRender: 'processStatus' },
        // },
        {
          title: '开始时间',
          dataIndex: 'createTime',
          key: 'createTime',
          // width: 180,
        },
        // {
        //   title: '结束时间',
        //   dataIndex: 'endTime',
        //   key: 'endTime',
        //   width: 180,
        // },
        // {
        //   title: '完成度',
        //   dataIndex: 'completion',
        //   key: 'completion',
        //   scopedSlots: { customRender: 'completion' },
        // },
        {
          title: '执行状态',
          dataIndex: 'processState_dictText',
          key: 'processState_dictText',
          // customRender: function (t, r, index) {
          //   if (t == 1) {
          //     return '执行中'
          //   }
          //   if (t == 2) {
          //     return '成功'
          //   }
          //   if (t == 3) {
          //     return '失败'
          //   }
          // },
        },

        // {
        //   title: '是否需要退网',
        //   dataIndex: 'isExit',
        //   key: 'isExit',
        //   scopedSlots: { customRender: 'isExit' },
        //   ellipsis: true,
        // },
        {
          title: '操作',
          key: 'action',
          scopedSlots: { customRender: 'action' },
        },
      ],
      processList: [
        { index: 1, label: '需求提报' },
        { index: 2, label: '需求梳理' },
        { index: 3, label: '星指链路信道资源配置' },
        { index: 4, label: '指控车入网' },
        { index: 5, label: '指控车时隙资源分配' },
        { index: 6, label: '导弹入网' },
        { index: 7, label: '导弹信道资源分配' },
        { index: '8-1', label: '网络状态上报' },
        { index: '8-2', label: '网络状态查询' },
        { index: 9, label: '控星指令鉴权' },
        { index: 10, label: '抗干扰决策与调整' },
        { index: 11, label: '导弹退网' },
        { index: 12, label: '指控车退网' },
      ],
      datas: [
        { id: 1, check: true },
        { id: 2, check: false },
        { id: 3, check: false },
        { id: 4, check: true },
        { id: 5, check: false },
      ],
      obj: [
        { label: '开始' },
        { label: '处理作战需求' },
        { label: '将星指上行链路变频器频点信息封装成复合链路帧' },
        { label: '将星指下行链路变频器频点信息封装成复合链路帧' },
        { label: '将复合链路帧发送到业务及综合管理单元' },
      ],
      obj1: [
        { label: '开始' },
        { label: '指控车向通信管控发送指控车入网申请' },
        { label: '通信管控向指控车回复入网应答信息' },
        { label: '指控车向通信管控发送入网确认信息' },
        { label: '通信管控更新指控车入网状态' },
      ],
      obj2: [
        { label: '开始' },
        { label: '通信管控封装星指上行链路时隙分配信息复合链路帧' },
        { label: '通信管控向卫星发送星指上行链路时隙分配信息' },
        { label: '卫星向通信管控发送星指上行链路时隙资源分配响应信息' },
        { label: '通信管控向指控车周期性广播星指链路上行时隙分配信息' },
      ],
      obj3: [
        { label: '开始' },
        { label: '指控车向通信管控发送导弹资源分配申请' },
        { label: '通信管控向指控车发送导弹资源分配信息' },
        { label: '指控车向通信管控发送导弹资源分配应答' },
        { label: '通信管控向卫星发送上行链路接收机频率配置指令' },
      ],
      obj4: [
        { label: '开始' },
        { label: '指控车向通信管控发送控星指令鉴权申请' },
        { label: '通信管控进行指令集对比' },
        { label: '通信管控向卫星发送控星指令' },
        { label: '通信管控向指控车发送控星指令鉴权回复' },
      ],
      obj5: [
        { label: '开始' },
        { label: '指控车向通信管控发起退网申请' },
        { label: '通信管控向指控车回复退网响应' },
        { label: '指控车向通信管控发送退网确认' },
        { label: '通信管控收到退网确认后，释放指控车占用的资源' },
        { label: '通信管控向卫星发送资源释放指令' },
      ],
      labelCol: {
        xs: { span: 1 },
        sm: { span: 2 },
      },
      wrapperCol: {
        xs: { span: 10 },
        sm: { span: 16 },
      },
    }
  },
  mounted() {
    // this.$refs.steps1.visible = true
    this.queryParam.createTimes=moment()
  },
  methods: {
    addOneDay(dateTimes) {
      let date = new Date(dateTimes).getTime() + 86400000
      return moment(date).format('YYYY-MM-DD')
      console.log(moment(date).format('YYYY-MM-DD HH:mm:ss'), '时间 ')
    },
    onDateChange: function (value, dateString) {
      this.queryParam.createTime_begin = this.queryParam.createTimes
      this.queryParam.createTime_end = this.addOneDay(this.queryParam.createTimes)
      console.log(this.addOneDay(this.queryParam.createTimes), '*-*-')
    },
    onDateOk(value) {
      console.log(value)
    },
    handleShowInfo(record) {
      console.log(record.id)
      this.$refs.detailedProcess.showModal(record.id)
    },
    onChange() { },
    formatStatus(text) {
      let target = this.processList.find((i) => i.index == text)
      return target.label
    },
    handleShow(val) {
      console.log(val)
      this.$refs.flow.showModal(val)
    },
  },
}
</script>

<style scoped>
.warming {
  color: #e1d576;
}
.success {
  color: #70eb70;
}
.err {
  color: #eb4949;
}
</style>
